<!DOCTYPE html>
<html>
    <head>
        <title> 京东商城－产品列表 </title>
        <meta charset="utf-8"/>
        <link rel="icon" href="img/favicon.ico">
        <link rel="stylesheet" href="css/jd.css">
        <link rel="stylesheet" href="css/product.css">
    </head>

    <body>
        <div id="header"></div>
        <div id="main">
            <div class="affix">
                <h4>商家精选</h4>
            </div>
            <div class="container productlist">
                <!-- 排序部分 -->
                <header>
                    <ul>
                        <li><a href="" class="curr">销量</a></li>
                        <li><a href="">价格</a></li>
                        <li><a href="">评论数</a></li>
                        <li><a href="">上架时间</a></li>
                    </ul>
                    <ol>
                        <li><a href="">&lt;</a></li>
                        <li><a href="">&gt;</a></li>
                    </ol>
                </header>
                <!-- 产品列表 -->
                <section id="plist">
                    <ul>
                    <!--
                        <li>
                            <a href=""><img src="images/phone/phone_01.jpg" alt=""/></a>
                            <p>￥1199.00</p>
                            <h1><a href="">小米 Note 全网通 白色 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_02.jpg" alt=""/></a>
                            <p>￥3999.00</p>
                            <h1><a href="">Apple iPhone 6s (A1700) 16G 玫瑰金色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_03.jpg" alt=""/></a>
                            <p>￥2499.00</p>
                            <h1><a href="">PPO R9 4GB+64GB内存版 玫瑰金 全网通4G手机 双卡</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_04.jpg" alt=""/></a>
                            <p>￥899.00</p>
                            <h1><a href="">小米 红米 3S 高配全网通 3GB内存 32GB ROM 经典金色</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_05.jpg" alt=""/></a>
                            <p>￥2999.00</p>
                            <h1><a href="">金立M6 Plus 香槟金 4GB+64GB版 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_06.jpg" alt=""/></a>
                            <p>￥5799.00</p>
                            <h1><a href="">Apple iPhone 6s Plus (A1699) 64G 玫瑰金色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_07.png" alt=""/></a>
                            <p>￥2499.00</p>
                            <h1><a href="">vivo X7 全网通 4GB+64GB 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_08.jpg" alt=""/></a>
                            <p>￥1099.00</p>
                            <h1><a href="">小米 红米Note3 高配全网通版 3GB+32GB 金色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_09.jpg" alt=""/></a>
                            <p>￥2499.00</p>
                            <h1><a href="">【六个月碎屏换新】荣耀8 4GB+32GB 全网通版 魅海蓝 双镜头，双2.5D玻璃</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_10.jpg" alt=""/></a>
                            <p>￥1799.00</p>
                            <h1><a href="">荣耀7 (PLK-AL10) 3GB+64GB内存版 荣耀金 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_11.jpg" alt=""/></a>
                            <p>￥2799.00</p>
                            <h1><a href="">荣耀 V8 全网通 高配版 4GB+64GB 香槟金 移动联通电信4G手机 双卡双待双通</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_12.jpg" alt=""/></a>
                            <p>￥1099.00</p>
                            <h1><a href="">荣耀 畅玩5X 3GB内存版 落日金 移动联通电信4G手机 双卡双待 炫酷指纹</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_13.jpg" alt=""/></a>
                            <p>￥4199.00</p>
                            <h1><a href="">Apple iPhone 6 (A1586) 64GB 金色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_14.jpg" alt=""/></a>
                            <p>￥4199.00</p>
                            <h1><a href="">TCL 初现 750 雅金 移动联通电信4G手机 双卡双待 后置1600万摄像，美姿拍照！</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_15.jpg" alt=""/></a>
                            <p>￥3988.00</p>
                            <h1><a href="">华为 P9 plus 64GB 琥珀灰 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_16.jpg" alt=""/></a>
                            <p>￥2198.00</p>
                            <h1><a href="">Apple iPhone 5s (A1530) 16GB 金色 移动联通4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_17.jpg" alt=""/></a>
                            <p>￥2798.00</p>
                            <h1><a href="">vivo X7Plus 全网通 4GB+64GB 移动联通电信4G手机 双卡双待 金色</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_18.jpg" alt=""/></a>
                            <p>￥1099.00</p>
                            <h1><a href="">华为 畅享5S 金色 移动联通电信4G手机 双卡双待 10万好评手机！</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_19.jpg" alt=""/></a>
                            <p>￥3899.00</p>
                            <h1><a href="">Apple iPhone 6 Plus (A1524) 16GB 银色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_20.jpg" alt=""/></a>
                            <p>￥2599.00</p>
                            <h1><a href="">华为 麦芒5 全网通 4GB+64GB版 香槟金 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_21.jpg" alt=""/></a>
                            <p>￥1799.00</p>
                            <h1><a href="">小米5 全网通 标准版 3GB内存 32GB ROM 白色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_22.jpg" alt=""/></a>
                            <p>￥3188.00</p>
                            <h1><a href="">华为 P9 全网通 3GB+32GB版 流光金 移动联通电信4G手机 双卡双待 麒麟955</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_23.jpg" alt=""/></a>
                            <p>￥999.00</p>
                            <h1><a href="">金立 金钢 标准版 爵士金 移动联通电信4G手机 双卡双待 4G全网通</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_24.jpg" alt=""/></a>
                            <p>￥999.00</p>
                            <h1><a href="">360手机 N4 全网通 4GB+32GB 阳光白 移动联通电信4G手机 双卡双待</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_25.jpg" alt=""/></a>
                            <p>￥1299.00</p>
                            <h1><a href="">小米 Max 全网通 标准版 3GB内存 32GB ROM 金色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_26.jpg" alt=""/></a>
                            <p>￥3688.00</p>
                            <h1><a href="">华为 P9 全网通 4GB+64GB版 金色 移动联通电信4G手机 双卡双待 后置1200万</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_27.jpg" alt=""/></a>
                            <p>￥988.00</p>
                            <h1><a href="">乐视（Le）乐2（X620）32GB 原力金 移动联通电信4G手机 双卡双待 5.5英寸</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_28.jpg" alt=""/></a>
                            <p>￥1299.00</p>
                            <h1><a href="">努比亚(nubia)【3+64GB】小牛5 Z11mini 黑色 移动联通电信4G手机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_29.jpg" alt=""/></a>
                            <p>￥1399.00</p>
                            <h1><a href="">乐视（Le）乐2Pro 32GB 金色 移动联通电信4G手机 双卡双待 5.5英寸In-Cell屏</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_30.jpg" alt=""/></a>
                            <p>￥2799.00</p>
                            <h1><a href="">华为 Mate 8 3GB+32GB版 玫瑰金 移动联通电信4G手机 双卡双待 麒麟950芯片</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_31.jpg" alt=""/></a>
                            <p>￥799.00</p>
                            <h1><a href="">小米 4c 标准版 全网通 白色 移动联通电信4G手机 双卡双待 高通骁龙808畅销机</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_32.jpg" alt=""/></a>
                            <p>￥2498.00</p>
                            <h1><a href="">vivo X7 全网通 4GB+64GB 移动联通电信4G手机 双卡双待 星空灰 vivox7</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_33.jpg" alt=""/></a>
                            <p>￥599.00</p>
                            <h1><a href="">联想 乐檬3 （K32C36）16GB 金色 移动4G手机 双卡双待 刀锋致敬经典</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_34.jpg" alt=""/></a>
                            <p>￥749.00</p>
                            <h1><a href="">华为 荣耀 畅玩4X 晨曦金 移动联通电信4G手机 双卡双待 5.5英寸大屏看片利器</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_35.jpg" alt=""/></a>
                            <p>￥699.00</p>
                            <h1><a href="">三星 Galaxy On5（G5500）金色 移动联通4G手机 真皮质感后盖，2600毫安大容量</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>
                        <li>
                            <a href=""><img src="images/phone/phone_36.jpg" alt=""/></a>
                            <p>￥1299.00</p>
                            <h1><a href="">OPPO A37 2GB+16GB内存版 玫瑰金 全网通4G手机 双卡双待 【赠品任你选】</a></h1>
                            <div>
                                <a href="" class="contrast"><i></i>对比</a>
                                <a href="" class="p-operate"><i></i>关注</a>
                                <a href="" class="addcart"><i></i>加入购物车</a>
                            </div>
                        </li>-->
                    </ul>
                    <ol class="pager">
                    <!--
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li class="active"><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        -->
                    </ol>
                </section>
            </div>
        </div>
        <div id="footer"></div>
        
        <!--模态登录对话框-->
        <div class="modal">
            <div class="modal-dialog">
                <div class="modal-content">
                    <h4>用户登录</h4>
                    <p class="alert">
                        请在此处输入您的注册信息。
                    </p>
                    <form id="login-form">
                        <input type="text" placeholder="请输入登录用户名" name="uname" value="qiangdong">
                        <input type="password" placeholder="请输入登录密码" name="upwd" value="123456">
                        <input type="button" value="提交登录信息" id="bt-login">
                    </form>
                </div>
            </div>
        </div>
        
        <script src="js/jquery-1.11.3.js">
        </script>
        <script src="js/productlist.js">
        </script>

    </body>
</html>
